﻿<UserControl x:Class="ThumbGen.SimpleSpinner"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="32" Width="32" x:Name="userControl">
    <UserControl.Resources>
        <LinearGradientBrush x:Key="donutBackground" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="RoyalBlue" Offset="0"/>
            <GradientStop Color="LightBlue" Offset="1"/>
        </LinearGradientBrush>

        <Style TargetType="Control">
            <Setter Property="Background" Value="{StaticResource donutBackground}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Control">
                        <ControlTemplate.Resources>
                            <Storyboard x:Key="startSpinning" RepeatBehavior="Forever">
                                <DoubleAnimationUsingKeyFrames 
                                        BeginTime="00:00:00" 
                                        Storyboard.TargetName="donut" 
                                        Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="180"/>
                                    <SplineDoubleKeyFrame KeyTime="00:00:01.0000000" Value="360"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </ControlTemplate.Resources>

                        <!-- whenvever the control becomes visible begin the startSpinning storyboard -->
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsVisible" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard 
                                    x:Name="startSpinningStoryboard" 
                                    Storyboard="{StaticResource startSpinning}" 
                                    />
                                </Trigger.EnterActions>

                                <Trigger.ExitActions>
                                    <StopStoryboard BeginStoryboardName="startSpinningStoryboard"/>
                                </Trigger.ExitActions>
                            </Trigger>
                        </ControlTemplate.Triggers>


                        <Viewbox Stretch="Fill">
                            <Path 
                            x:Name="donut" 
                            Fill="{TemplateBinding Background}"
                            Stretch="Fill" 
                            RenderTransformOrigin="0.5,0.5" 
                            Data=
                                "M12.526,6.132 C8.9946932,6.132 6.132,8.9946932 6.132,12.526 6.132,16.057307 8.9946897,
                                18.92 12.526,18.92 16.057311,18.92 18.92,16.057311 18.92,12.526 18.92,8.9946897 16.057307,
                                6.132 12.526,6.132 z M12.5,0 C19.403552,0 25,5.596434 25,12.5 25,19.40356 19.40356,25 12.5,
                                25 5.596434,25 0,19.403552 0,12.5 0,5.5964418 5.5964418,0 12.5,0 z" >
                                <Path.RenderTransform>
                                    <RotateTransform Angle="0"/>
                                </Path.RenderTransform>
                            </Path>
                        </Viewbox>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </UserControl.Resources>
    <Control Width="{Binding ElementName=userControl, Path=Width}"
             Height="{Binding ElementName=userControl, Path=Height}"/>
</UserControl>
